
/* ПЛАШКИ УРОКОВ - 2 Ряда*/

/*Задаем 2 ряда*/
.lesson-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    gap: 10px;
    margin-bottom: 30px !important;
    padding: 0 !important;
    background: 0 !important;  
}

/*Задаем 2 ряда*/
.lesson-list li {
    position: relative;
    flex: 1 1 50%;
    max-width: calc(100% / 2 - 5px);
    margin: 0 !important;
    transition: all .3s;
    background: url(https://fs.getcourse.ru/fileservice/file/download/a/813408/sc/60/h/d192076d29dceb875dc01816048f4575.jpg);
    background-size: cover;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.4);
    border-radius: 10px;
}

/* Важно: делаем саму ссылку блочным элементом и контейнером для псевдо-кнопки */
.lesson-list li .item-a {
    display: block;
    position: relative; /* чтобы :after позиционировался относительно ссылки */
    height: 100%;
    text-decoration: none;
    color: inherit;
}

@media (max-width:767.98px) {
.lesson-list li {
    flex: 1 1 100%;
    max-width: calc(100% / 1 - 5px);
  }}

/*Убираем картинку - не влазиет*/
.lesson-list .info .item-image {
     display: none;
}

/* Высота плашки*/
.lesson-list li .item-a,
.lesson-list li .info,
.lesson-list tr {
    min-height: 180px!important;
    position: relative
}

.lesson-list .info tr {
    display: flex;
    height: 100%;
}

/* Отступы*/
.lesson-list .item-main-td {
    padding-top: 5px!important;
    padding-left: 5px!important;
}

.lesson-list li .state-icon-block {
    display: none;
}

.lesson-list li .info {
    margin-left: 0px!important;
    background: transparent!important; 
}

/* Заголовок урока */
.item-main-td .link.title {
  margin-top: 5px;  
  padding-left: 5px;
  padding-right: 5px!important;
  font-size: 20px;
  font-family: 'Montserrat', sans-serif!important;
  font-weight: 500;
  color: #FFF;
  line-height: 1.0!important;
  max-width: calc(100% - 20px);
    /* режим большой заголовок в 2 строки */
   -webkit-line-clamp: 2;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis!important;
}

/* Описание */
.lesson-list .description {
    font-size: 14px!important;
    line-height: 110%;
    font-family: 'Montserrat', sans-serif!important;
    font-weight: 500;
    color: #FFF;
    margin-top: 10px!important;
    margin-left: 5px;
    padding-top: 0 !important;
     /* режим большой заголовок в 2 строки */
    -webkit-line-clamp: 2;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis!important;
    max-width: calc(100% - 20px);
}

/* Давим фон от есть задание*/
.lesson-list li .user-state-bg {
     background: none!important;
}

/*   Есть задание*/
.vmiddle .user-state-label{
    color: #C68E17!important;
    display: inline-block!important;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 14px;
    1padding: 1px 10px 2px 0!important;
    font-family: 'Montserrat', sans-serif!important;
    font-weight: 500;
    line-height: 110%;
}

.user-state-label.has-start-at.lesson-date {
    color: #FFF!important;
}

/* Плашка просмотрено*/
.lesson-list__video-watched{
   font-family: 'Montserrat', sans-serif!important;
   font-size: 14px;
   line-height: 1.8;
   margin-top: 5px;
}

/* КНОПКА НА ПЛАШКАХ
   Перенесена на .item-a (ссылку) чтобы клик срабатывал как клик по ссылке.
*/
.lesson-list li .item-a:after { 
    position: absolute;
    font-family: 'Montserrat', sans-serif!important;
    padding: 6px 20px 6px 20px;
    color: #121212;
    font-size: 14px;
    font-weight: 600;
    content: 'ПЕРЕЙТИ';
    background: #D9D9D9;
    border-radius: 4px;
    border: 1px solid #333333;
    transition: all 0.5s;
    right: 15px;
    bottom: 15px;
    /* убрал margin-right/margin-bottom — используем right/bottom */
    z-index: 5; /* над содержимым */
    pointer-events: auto; /* псевдоэлемент привязан к ссылке, клик будет вести на неё */
}

/* hover/ focus — на саму ссылку */
.lesson-list li .item-a:hover:after,
.lesson-list li .item-a:focus:after {
    text-decoration:none;
    outline: none;
    transform: translateY(-5px);
}

/* Если хотите поддержку старых правил, можно оставить этот медиа-блок */
@media (max-width:991px) {
/* Заголовок урока */
.item-main-td .link.title {
  font-size: 20px;
}}

@media (max-width:400px) {
/* Заголовок урока */
.item-main-td .link.title {
    font-size: 18px;
}
/* Описание */
.lesson-list .description {
    font-size: 14px!important;
    line-height: 100%;
}
/* Высота плашки*/
.lesson-list li .item-a,
.lesson-list li .info,
.lesson-list tr {
    min-height: 250px!important;
    position: relative;
}}

/* Статус урока */
.lesson-list .link.title:after {
    font-family: 'FontAwesome', 'Montserrat', sans-serif!important;
    font-size: 16px;
    white-space: nowrap;
    position: absolute;
    bottom: 15px!important;
    left: 10px;  
}

@media (max-width:767.98px) {
.lesson-list .link.title:after {
   font-size: 14px;
  }

/* Описание */
.lesson-list .description {
     /* режим большой заголовок в 3 строки */
    -webkit-line-clamp: 3!important;
}}

/* Состояния */
.user-state-reached .link.title:after, 
.user-state-has_mission .link.title:after {
    content: '\f13e \00a0 \00a0 Доступен';
    color: #FFF; 
}

.user-state-answered .link.title:after {
    content: '\f017 \00a0 \00a0 Ждет проверки';
    color: #C68E17;
}

.user-state-answered .link.title:before {
    background: #C68E17;
}

.user-state-accomplished .link.title:after {
    content: '\f14a \00a0 \00a0 Принят';
   color: #FFF;
}
.user-state-accomplished .link.title:before {
    background: #FFF;
}

.user-state-need_accomplish .link.title:after {
    content: '\f13e \00a0 \00a0 Задание';
    color: #C68E17;
}
.user-state-need_accomplish .link.title:before {
    background: #C68E17;
}

.user-state-not_reached .link.title:after {
    content: '\f023 \00a0 \00a0 Недоступен';
    color: #FFF;
}

.user-state-not_reached .link.title {
    color: #FFF!important;
}

.user-state-not_reached .link.title:before {
    color: #FFF;
}

.user-state-not_reached {
    filter: grayscale(0.9);
}


.lesson-list li .info .vmiddle {
    height: 100%;
}
/* Отступ на 768 */
.lesson-list li .vmiddle {
    margin-left: 0px;
    padding-left: 0px;
}
/*------- ПЛАШКИ УРОКОВ КОНЕЦ--------*/



